import { createStore, applyMiddleware, combineReducers, compose } from 'redux';            // 引入createStore创建store，引入applyMiddleware 来使用中间件
import { composeWithDevTools } from 'redux-devtools-extension'  // 安装redux-devtools-extension的可视化工具。
import reducer from './reducer';  // 引入所有的reducer
import thunkMiddleware from 'redux-thunk'

/* 
export default () => createStore(reducer, {SWITCH_MENU: ''})
export default () => createStore(
  (state, {type,payload}) => {
  switch (type) {
    case 'SWITCH_MENU':
      return {...state, SWITCH_MENU: payload}
    default:
      return {...state}
  }}, 
  {SWITCH_MENU: ''}
  ) 
*/

// ——————————————————————————————————————————————————————————————————————————————————————————

const middlewares = [
  thunkMiddleware,
  // composeWithDevTools,
  require('redux-logger').createLogger(),
]

// 组合增强中间件
const enhancer = composeEnhancers(
  applyMiddleware(...middlewares),
  // other store enhancers if any
)

const composeEnhancers =
  typeof window === 'object' &&
    window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ?
    window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({
      // Specify extension’s options like name, actionsBlacklist, actionsCreators, serialize...
    }) : compose


const reducers = combineReducers({
  counter: (state, { type, payload }) => {
    switch (type) {
      case 'SWITCH_MENU':
        return { ...state, SWITCH_MENU: payload }
      default:
        return { ...state, SWITCH_MENU: {menuName:"首页"} }
    }
  }
})
// const reducers = (state, { type, payload }) => {
//   switch (type) {
//     case 'SWITCH_MENU':
//       return { ...state, SWITCH_MENU: payload }
//     default:
//       return { ...state }
//   }
// }

export default function configStore() {
  const store = createStore(
    reducers,
    { SWITCH_MENU: '' },
    enhancer
  )
  return store
}